<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
    <title>智慧农业云服务平台</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <link rel="stylesheet" type="text/css" href="/css/base.css" />
    <link rel="stylesheet" type="text/css" href="/css/login.css" />
    <style>
        .layui-nav-bar {
            background-color: #344058;
        }
        .layui-layout-admin .layui-logo {
            color: #FFFFFF;
        }
        .layui-layout-left .layui-nav-item a i,.layui-layout-right .layui-nav-item i{
            color: #fff;
            font-size: 16px;
        }
        .layui-nav-tree .layui-nav-child dd.layui-this, .layui-nav-tree .layui-nav-child dd.layui-this a, .layui-nav-tree .layui-this, 		.layui-nav-tree .layui-this > a, .layui-nav-tree .layui-this > a:hover {
            background-color: #13a5da;
            /*background-color: #1e9fff;*/
            color: #fff;
        }
        .layui-nav-bar {
            background-color: #93ddf8;
        }
        .left-nav-bg {
            background: #344058 !important;
        }
        .layui-nav-tree .layui-nav-item a:hover {
            background-color: #344058;
        }
        .layui-nav-tree .layui-nav-child a:hover {
            background-color: #242d3d;
        }
        #allmap {width: 100%;height: 85%;overflow: hidden;margin:0;font-family:"微软雅黑";}
        #cur-equipment .layui-input {
            height: 30px;
        }
        .card-header {
            background: #fff;
            color: #000;
            border-left: 3px solid #0f9ac3;
        }
        .layui-btn-group {
            float: right;
            margin-top: 5px;
        }
        .layui-btn-group .layui-btn:last-child {
            border-radius: 0 3px 3px 0;
            background: #575a5d;
            color: #fff;
        }
        .layui-btn-group .layui-btn:first-child {
            border-radius:  3px 0 0 3px ;
        }
        #ctrol-equipment .btn-box {
            display: inline-block;
            height: 38px;
            line-height: 38px;
            padding: 0 18px;
            /*background-color: #009688;*/
            /*color: #fff;*/
            white-space: nowrap;
            text-align: center;
            font-size: 14px;
            border: 1px solid #cccccc;
            border-radius: 2px;
            cursor: pointer;
            transition: all 0.5s;
        }
        .scene-tree-content {
            overflow: auto;
        }
    </style>
    <script src="/layui/layui.js"></script>
    <script src="/js/artTemplate/template-web.js"></script>
    <script src="/js/iftmonitor/ezuikit.js"></script>
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div class="layui-header" style="background-color:#1ca5ce;/*#16b1ef;*/">
        <div class="layui-logo" style="background-color:#1389b4; /*#0f97e1;*/"><span >智慧农业云服务</span></div>
        <!-- 头部区域（可配合layui已有的水平导航） -->
        <ul class="layui-nav layui-layout-left" style="padding:0px;">
            <li class="layui-nav-item layadmin-flexible" lay-unselect="">
                <a href="javascript:;" layadmin-event="flexible" title="侧边伸缩">
                    <i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible" ></i>
                </a>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;">
                    <i class="layui-icon layui-icon-website" id="LAY_app_index" ></i>
                </a>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;">
                    <i class="layui-icon layui-icon-refresh-3" id="LAY_app_refresh" ></i>
                </a>
            </li>
            <!-- <li class="layui-nav-item">
                <a href="javascript:;">其它系统</a>
                <dl class="layui-nav-child">
                    <dd>
                        <a href="">邮件管理</a>
                    </dd>
                    <dd>
                        <a href="">消息管理</a>
                    </dd>
                    <dd>
                        <a href="">授权管理</a>
                    </dd>
                </dl>
            </li> -->
        </ul>

        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item layui-hide-xs" lay-unselect="" style="margin-right:30px;">
                <i class="layui-icon layui-icon-notice" ></i>
            </li>
            <%--<li class="layui-nav-item layui-hide-xs" id="layui-theme" lay-unselect="" style="margin-right:30px;">
                <i class="layui-icon layui-icon-notice" ></i>
            </li>--%>
            <li class="layui-nav-item">
                <i class="layui-icon layui-icon-note pointer" id="layui-MyMsg" title="我的信息" ></i>
            </li>
            <li class="layui-nav-item" style="margin-left:10px;">
                <a href="javascript:;" >
                    <img src="http://t.cn/RCzsdCq" class="layui-nav-img"> <span id="cur-user">-</span>
                </a>
                <dl class="layui-nav-child">
                    <dd>
                        <a href="javascript:;">基本资料</a>
                    </dd>
                    <dd>
                        <a href="javascript:;">安全设置</a>
                    </dd>
                </dl>
            </li>
            <li class="layui-nav-item">
                <a href="http://106.75.154.40:8082/admin" >后台管理</a>
            </li>
        </ul>
    </div>

    <div class="layui-side layui-bg-black left-nav-bg">
        <div class="layui-side-scroll">
            <ul class="layui-nav layui-nav-tree nav-left left-nav-bg"  lay-shrink="all" lay-filter="home">
            </ul>
            <ul id="main-nav" class="layui-nav layui-nav-tree left-nav-bg" lay-filter="test">
                <li class="layui-nav-item"><a href="/ift"><i class="layui-icon layui-icon-console"></i>&nbsp;&nbsp;<span>控制台</span></a></li>
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="" href="javascript:;"><i class="layui-icon layui-icon-headset"></i>&nbsp;&nbsp;<span>云监控</span><span class="layui-nav-more"></span></a>
                    <dl class="layui-nav-child">
                        <dd class="layui-this"><a href="/ift/monitor">&nbsp;&nbsp;监控面板</a></dd>
                        <dd class=""><a href="/ift/datasearch">&nbsp;&nbsp;数据查询</a></dd>
                        <dd class=""><a href="/ift/manager">&nbsp;&nbsp;综合管理</a></dd>
                        <dd class=""><a href="/ift/early-warning">&nbsp;&nbsp;预警分析</a></dd>
                    </dl>
                </li>

                <span class="layui-nav-bar" style="height: 0px; top: 317.5px; opacity: 0;"></span>
            </ul>

        </div>
    </div>

    <div class="layui-body layui-right">
        <div class="layui-tab layui-tab-card" lay-allowclose="true" lay-filter="layadmin-layout-tabs" overflow style="margin:0px;padding-bottom: 40px;">
            <%--<ul class="" id="main-tab" style="background: #fff;border: 0 none;">
                <!--<li class="layui-this" lay-id="/home/controller/" lay-attr="/home/controller/" id="tab-home">
                    <i class="layui-icon layui-icon-home"></i>
                </li>-->
                <li><a href="">云监控</a></li>
            </ul>--%>
            <div class="layui-card layadmin-header">
                <div class="layui-breadcrumb" lay-filter="breadcrumb" style="visibility: visible;">
                    <a ><cite>云监控</cite></a><span lay-separator="">/</span>
                    <a href="/ift/monitor" lay-href="">监控面板</a>
                </div>
            </div>
            <!--<div class="layui-tabs layui-nav-item" style="position:absolute;top:0px;right:0px;z-index: 9999;cursor:pointer;width: 50px;height: 41px;text-align: center;line-height: 40px;border: solid 1px #f2f2f2;">
                <i class="layui-icon layui-icon-down"></i>
            </div>-->

            <div class="layui-tab-content layui-fluid tab-content" id="main-content">
                <div class="layui-row layui-col-space8">
                    <div class="layui-col-md3">
                        <div class="layui-card-box">
                            <div class="layui-card">
                                <div class="layui-card-header card-header"><i class="layui-icon layui-icon-location"></i>&nbsp;地图显示<i class="layui-icon layui-icon-next" style="float: right;"></i></div>
                                <div class="layui-card-body" style="height: 350px;">
                                    <div style="width: 100%;height: 200px;text-align: center;" id="loading-map">
                                        <i style="font-size: 30px !important;line-height: 200px;" class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i>
                                    </div>
                                    <div align="center" style="color: #1E9FFF;" id="cur-scenery"></div>
                                    <div align="center" id="cur-addr"></div>
                                    <div id="allmap"></div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-card-box" style="margin-top: 15px;">
                            <div class="layui-card">
                                <div class="layui-card-header card-header">数据展示<i class="layui-icon layui-icon-next" style="float: right;"></i></div>
                                <div class="layui-card-body" id="data-show">
                                    <%--<div style="width: 100%;height: 200px;text-align: center;" id="tree-scenery">
                                        <i style="font-size: 30px !important;line-height: 200px;" class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i>
                                    </div>--%>
                                    <%--<div style="width: 100%; height: 100px;margin: 5px 0;padding: 20px;border: solid 1px #f5f5f5;box-shadow: 2px 2px 5px #f5f5f5;">
                                        <div style="overflow: hidden;">
                                            <span style="float: left">数据</span>
                                            <span style="float: right;">单位</span>
                                        </div>
                                        <p style="color: #666666;">当前设备</p>
                                    </div>--%>

                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md7">
                        <div class="layui-card-box">
                            <div class="layui-card">
                                <div class="layui-card-header card-header">监控数据
                                    <form style="float: right;" class="layui-form">
                                        <div class="layui-input-inline">
                                            当前设备：
                                        </div>
                                        <div id="cur-equipment" class="layui-input-inline">
                                            <select name="powerType" id="equipment-list" lay-filter="equipment-list" lay-search>
                                                <%--<option value="">请选择设备</option>--%>
                                            </select>
                                        </div>
                                    </form>
                                    <%--<span style="float: right;" id="equipment"></span>--%>
                                </div>
                                <div class="layui-card-body">
                                    <div class="layui-card-box">
                                        <div class="layui-card" >
                                            <div class="layui-card-header innercard-header">
                                                实时监控数据
                                                <div class="layui-btn-group">
                                                    <button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon layui-icon-chart"></i></button>
                                                    <button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon layui-icon-video"></i></button>
                                                </div>
                                               <%-- <span style="float: right;display: inline-block;width: 50px;line-height: 42px;">
                                                    <i class="layui-icon layui-icon-chart" style="background: #fff;padding: 4px;border: 1px solid #ccc;border-radius: 3px;"></i>
                                                    <i class="layui-icon layui-icon-video" style="background: #fff;padding: 4px;border: 1px solid #ccc;border-radius: 3px;"></i>
                                                </span>--%>
                                            </div>
                                            <div class="layui-card-body" id="online-data" style="height: 500px; overflow: auto;">
                                                <div style="width: 100%;height: 200px;text-align: center;" id="loading-monitor">
                                                    <i style="font-size: 30px !important;line-height: 200px;" class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i>
                                                </div>

                                            </div>
                                        </div>
                                        <div class="layui-card">
                                            <div class="layui-card-header innercard-header">控制按钮</div>
                                            <div class="layui-card-body" id="ctrol-equipment">
                                                <%--<div style="width: 100%;height: 200px;text-align: center;" id="tree-scenery">
                                                    <i style="font-size: 30px !important;line-height: 200px;" class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i>
                                                </div>--%>
                                                <%--<div class="layui-inline">
                                                    <a class="btn-box" data-type="reload" style="height: 140px;">
                                                        <div id="tempDiv">
                                                            <h4 class="title">控制灯--1</h4>
                                                            <span class="layui-badge-dot btn-status" style="display: inline-block;padding: 2px;margin-right: 5px;"></span>
                                                            <span class="btn-status-text">已关闭</span>
                                                            &lt;%&ndash;<i class="layui-icon layui-icon-console">关闭</i>&ndash;%&gt;
                                                        </div>
                                                        <button class="layui-btn layui-btn-normal open">开启</button>
                                                        <button class="layui-btn layui-btn-danger layui-btn-disabled close">关闭</button>
                                                    </a>
                                                </div>--%>
                                                   <%-- <div class="layui-inline">
                                                        <a class="layui-btn layui-btn-primary" data-type="reload" style="height: 140px;">
                                                            <div id="tempDivS">
                                                                <h4>控制灯--2</h4>
                                                                <i class="layui-icon layui-icon-console">关闭</i>

                                                            </div>
                                                            <button class="layui-btn layui-btn-normal">开启</button>
                                                            <button class="layui-btn layui-btn-disabled">关闭</button>

                                                        </a>
                                                    </div>--%>
                                                <%--<div class="layui-inline">
                                                    <a class="layui-btn layui-btn-danger layui-btn-normal delAll_btn">关闭</a>
                                                </div>--%>
                                            </div>
                                        </div>
                                        <div class="layui-card">
                                            <div class="layui-card-header innercard-header">变化趋势</div>
                                            <div class="layui-card-body" style="padding: 0;height: 500px;">
                                                <%--<div style="width: 100%;height: 200px;text-align: center;" id="loading-trend">
                                                    <i style="font-size: 30px !important;line-height: 200px;" class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i>
                                                </div>--%>
                                                <div class="layui-tab layui-tab-brief layadmin-latestData">
                                                    <ul class="layui-tab-title" id="check-item">
                                                        <%--<li class="layui-this">今日热搜</li>
                                                        <li class="">今日热帖</li>--%>
                                                    </ul>
                                                    <div class="layui-tab-content" id="echart-show">
                                                        <%--<div class="layui-tab-item layui-show" style="width: 100%; height: 300px;">
                                                        </div>--%>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md2">
                        <div class="layui-card-box">
                            <div class="layui-card">
                                <div class="layui-card-header card-header">场景<i class="layui-icon layui-icon-next" style="float: right;"></i></div>
                                <div class="layui-card-body scene-tree-content">
                                    <div style="width: 100%;height: 200px;text-align: center;" id="tree-scenery">
                                        <i style="font-size: 30px !important;line-height: 200px;" class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i>
                                    </div>
                                    <ul style="height: 100%;" id="tree"></ul>

                                    <%--<ul style="height: 100%;" id="tree2"></ul>--%>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
        <div class="layui-footer" style="text-align: center;">
            <!-- 底部固定区域 -->
            © 仲恺农业工程学院英东楼109实验室
            <div id="test">

            </div>
        </div>
    </div>
</div>
    <!--首页echarts-->
    <script type="text/javascript" src="/echarts/echarts.js"></script>
    <script type="text/javascript" src="/js/jquery-3.3.1.js"></script>
    <script type="text/javascript" src="/js/jquery.cookie.js"></script>
    <%--<script type="text/javascript" src="/js/common.js"></script>--%>
    <script type="text/javascript" src="/layui/mymodule/common.js"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=GG3l2NMIye4E69Mt9zcuG7S07Uuvvyno"></script>
    <script type="text/javascript" src="/js/iftmonitor/monitor.js"></script>
    <!--<script type="text/javascript" src="../../static/js/tabs.js" ></script>-->

</body>

</html>
